<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="UTF-8"/>
    <title>typeList</title>
    <link rel="stylesheet" th:href="@{/css/bootstrap.min.css}" crossorigin="anonymous">
    <link rel="stylesheet" th:href="@{/css/typelist.css}">
</head>
<body class="container mt-4">
<nav class="navbar navbar-expand-lg custom-navbar mb-4">
    <div class="container-fluid">
        <a class="navbar-brand text-white" href="#">MYBLOG</a>
        <button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#navbarNav" aria-controls="navbarNav" aria-expanded="false" aria-label="Toggle navigation">
            <span class="navbar-toggler-icon"></span>
        </button>
        <div class="collapse navbar-collapse" id="navbarNav">
            <ul class="navbar-nav ms-auto">
                <li class="nav-item">
                    <p class="nav-link active text-white">欢迎您</span></p>
                </li>
                <li class="nav-item">
                    <a class="nav-link text-white" th:href="@{/articletype/page?pageIndex=0}">文章类型</a>
                </li>
                <li class="nav-item">
                    <a class="nav-link text-white" th:href="@{/article/findAll}">文章列表</a>
                </li>
                <li class="nav-item">
                    <a class="nav-link text-white" th:href="@{/user/findAll}">用户列表</a>
                </li>
                <li class="nav-item">
                    <a class="nav-link text-white" th:href="@{/logout}">退出</a>
                </li>
            </ul>
        </div>
    </div>
</nav>

<h1 class="text-center mb-4">文章类型列表
    <a href="/" th:href="@{/}" class="btn btn-info ms-2">返回主页</a>
</h1>

<form action="#" th:action="@{/articletype/pageByName}" method="get" class="d-flex justify-content-center mb-4">
    <input type="hidden" name="pageIndex" value="0"/>
    <div class="mb-3 row w-75">
        <label for="type" class="col-sm-2 col-form-label"></label>
        <div class="col-sm-6">
            <input type="text" name="type" id="type" class="form-control" placeholder="请输入文章类型名称"/>
        </div>
        <div class="col-sm-2">
            <button type="submit" class="btn btn-info">查询</button>
        </div>
    </div>
</form>

<div class="row mb-2">
    <div class="col-sm-3 control-label">
        <a href="/toAdd" th:href="@{/articletype/toAdd}" class="btn btn-info btn-custom">新增</a>
    </div>
    <div class="col-sm-9 d-flex justify-content-end">
        <a href="#" th:href="@{/articletype/page?pageIndex=0}" class="btn btn-info btn-custom">首页</a>
        <a href="#" th:href="@{/articletype/page(pageIndex=${pre})}" class="btn btn-info btn-custom">上页</a>
        <a href="#" th:href="@{/articletype/page(pageIndex=${next})}" class="btn btn-info btn-custom">下页</a>
        <a href="#" th:href="@{/articletype/page(pageIndex=${page.getTotalPages()-1})}" class="btn btn-info btn-custom">末页</a>
    </div>
</div>

<div class="table-container">
    <table class="table table-hover shadow-sm rounded">
        <thead>
        <tr>
            <th>编号</th>
            <th>文章类型</th>
            <th>创建时间</th>
            <th>修改时间</th>
            <th>Edit</th>
            <th>Delete</th>
        </tr>
        </thead>
        <tbody>
        <tr th:each="articletype, articletypeStat : ${page.getContent()}">
            <th scope="row" th:text="${page.getSize() * page.getNumber() + articletypeStat.index + 1}">1</th>
            <td th:text="${articletype.type}">neo</td>
            <td th:text="${#dates.format(articletype.createTime, 'yyyy-MM-dd HH:mm')}">Otto</td>
            <td th:text="${#dates.format(articletype.updateTime, 'yyyy-MM-dd HH:mm')}">6</td>
            <td><a th:href="@{/articletype/toEdit(id=${articletype.id})}" class="btn btn-warning btn-sm">edit</a></td>
            <td><a th:href="@{/articletype/delete(id=${articletype.id})}" class="btn btn-danger btn-sm">delete</a></td>
        </tr>
        </tbody>
    </table>
</div>


<footer class="footer mt-4">
    <div class="container text-center py-3">
        <p>&copy; 2024 MYBLOG. All rights reserved.</p>
    </div>
</footer>

</body>
</html>